<template>
  <div class="regularWork" id="regularWork">
    <com_configure
      ref="spaceListRef"
      :activeIndex="activeIndex"
      :table_height="table_height"
      v-show="activeIndex == 0"
      @changeNav="changeNav"
    ></com_configure>
  </div>
</template>

<script setup lang="ts">
import com_configure from "./com_configure/com_configure.vue";
import com_useType from "./components/com_useType/com_useType.vue";
import com_spaceState from "./components/com_spaceState/com_spaceState.vue";
import { getPermissionBtn } from "@/utils/utils";

let activeIndex = ref(0);

const spaceListRef = ref<any>(null); //空间列表组件
const useTypeRef = ref<any>(null); //使用类型组件
const spaceStateRef = ref<any>(null); //空间状态组件

//切换导航栏
const changeNav = (val: number) => {
  activeIndex.value = val;
  if (val == 0) {
    // spaceListRef.value.getData();
  } else if (val == 1) {
    // useTypeRef.value.getData();
  } else if (val == 2) {
    // spaceStateRef.value.getData();
  }
};

let table_height = ref(0);

//获取表格最大高度 table_height
const getTabHeight = () => {
  let page = document.getElementById("com_configure");
  let searchBar = document.getElementById("configure_searchBar");
  if (activeIndex.value == 1) {
  } else if (activeIndex.value == 2) {
  }
  let pageHeight = page!.offsetHeight;
  let searchBarHeight = searchBar!.offsetHeight;
  table_height.value = pageHeight - searchBarHeight - 150;
};

onMounted(() => {
  nextTick(() => {
    getTabHeight();
    window.addEventListener("resize", getTabHeight); //监听屏幕变化,重新计算表格高度
  });
});

onBeforeUnmount(() => {
  window.removeEventListener("resize", getTabHeight); // 销毁绑定方法
});
</script>

<style lang="scss" scoped>
.regularWork {
  height: 100%;
  // flex: 1;
  min-height: 0;
}
</style>
